<template>
	<div>


		<el-card class="box-card">
			<div slot="header" class="clearfix">
				<span>个人中心</span>
				<el-button style="float: right; padding: 3px 0" type="text" v-on:click="Logout()">退出登录</el-button>
			</div>
			<div class="text item">
				用户ID:{{user_id}}
			</div>
			<div class="text item">
				用户名称:{{user_name}}
			</div>
			<div class="text item">
				用户电话:{{phone}}
			</div>
			<div class="text item">
				用户职务:{{user_duty}}
			</div>
		</el-card>



		<div style="margin-bottom: 60px;width: 100%;"></div>
	</div>
</template>

<script>
	// @ is an alias to /src
	// import BottomTab from '../components/bottom_tab/bottom_tab.vue'
	// import SideBar from "../components/admin_block/side_bar.vue"
	// import Inventory from "../components/admin_block/inventory_block.vue"
	// import Select from "../components/admin_block/select_block.vue"
	import Cookies from 'js-cookie'
	import {LogoutCookie} from '../utils/auth.js'
	export default {
		name: 'Home',
		data() {
			return {
				phone: '',
				user_id: '',
				user_name: '',
				user_duty: '',

			}
		},
		components: {

		},

		methods: {
			
			Logout(){
				LogoutCookie()
				this.$router.push({
					'name': '/login'
				})
				this.$message({
					message: "退出成功！",
					type: 'success'
				})
			}

		},

		mounted() {

			this.phone = Cookies.get('phone')
			this.user_id = Cookies.get('user_id')
			this.user_name = Cookies.get('name')
			this.user_duty = Cookies.get('duty')
		},
	}
</script>

<style scoped lang="less">
	.text {
		font-size: 14px;
	}

	.item {
		margin-bottom: 18px;
	}

	.clearfix:before,
	.clearfix:after {
		display: table;
		content: "";
	}

	.clearfix:after {
		clear: both
	}

	.box-card {
		// width: 480px;
	}
</style>
